<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-touch-fullscreen" content="yes">
<title>KISSY Overlay&Popup</title>

<link rel="stylesheet" href="../assets/cool.css"/>
<script src="/kissy/build/seed-debug.js"></script>
    <script src="/kissy/src/package.js"></script>
</head>
<body>
<button id='show'>show</button>
<button id='hide'>hide</button>
<div id="wrap" style="position: relative;z-index: 0;
overflow: scroll;
height: 500px;border: 1px solid red;">
    <div style="height: 1000px;">

    </div>

</div>
<script>
    KISSY.use("overlay,node", function (S, Overlay,$) {
        var o = new Overlay.Dialog({
            headerContent:"哈哈",
            bodyContent:"嘿嘿",
            render:'#wrap',
            width:300,
            height:300
        });

        $("#show").on("click",function(){
            o.center('#wrap');
            o.show();

        });

        $("#hide").on("click",function(){
            o.hide();
        });
    });
</script>
</body>
</html>